<%--
  Created by IntelliJ IDEA.
  User: lichengming
  Date: 2017/6/15
  Time: 下午12:11
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/resources.jsp" %>

<html>
<head>
    <title>管理员管理</title>

    <link rel="stylesheet" href="/ems/css/upload/webuploader.css">
    <link rel="stylesheet" href="/ems/css/tree/zTreeStyle.css">
    <script src="/ems/js/jquery.md5.js"></script>
    <script src="/ems/js/tree/jquery.ztree.all.min.js"></script>


    <style type="text/css">

        .ems_add_gbtn {
            flex: auto;
            display: flex;
            justify-content: flex-end;
        }

        .ems_add_heading {
            display: flex;
            flex-direction: row;
            align-items: center;
            padding: 5px 10px;
        }
        .ems_form_reset {
            margin-left: 10px;
        }

        .ems_form_checkbox_g>label {
            width: 120px;
            margin-right: 10px;
        }

        .ems_form_checkbox_g>label>a {
            display: none;
            text-decoration: none;
        }
        #add_new_role>a {
            text-decoration: none;
        }
    </style>
</head>
<body>
<div class="ems_form">
    <div class="panel panel-default">
        <div class="panel-heading ems_add_heading">
            <h3 class="panel-title">管理员新增</h3>

            <div class="ems_add_gbtn">
                <button type="button" class="btn btn-primary ems_form_submit">
                    <span class="glyphicon glyphicon-check"></span> 保存
                </button>
                <button type="button" class="btn btn-default ems_form_reset">
                    <span class="glyphicon glyphicon-shopping-cart"></span> 重置
                </button>
            </div>
        </div>


        <div class="ems_edit_content">
            <form class="form-horizontal ems_internal_form">
                <div class="form-group">
                    <label class="col-sm-3 control-label">登录账号：</label>
                    <div class="col-sm-6">
                        <input type="text" name="login_account" value="${record.login_account}" id="login_account" class="form-control" placeholder="不能为中文，长度不超过32">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label">登录密码：</label>
                    <div class="col-sm-6">
                        <input type="password" required value="${record.password}" id="password" name="password" class="form-control" placeholder="不能为中文">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label">手机号：</label>
                    <div class="col-sm-6">
                        <input type="number" required name="phone" value="${record.phone}" class="form-control" placeholder="手机号">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-3 control-label">姓名：</label>
                    <div class="col-sm-6">
                        <input type="text" name="real_name" value="${record.real_name}" class="form-control" placeholder="姓名，长度不超过12">
                    </div>
                </div>


                <div class="form-group">
                    <label class="col-sm-3 control-label">菜单权限：</label>
                    <div class="col-sm-6">
                        <div id="menu_tree" class="ztree"></div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<script type="text/javascript">

    var setting = {
        check: {
            enable: true,
            chkStyle: "checkbox",
            chkboxType: { "Y": "p", "N": "s" }
        },
        data: {
            simpleData: {
                enable: true
            }
        }
    };

    var treeObj = null;
    $(document).ready(function(){
        var menuNodes = JSON.parse('${menuList}');
        treeObj = $.fn.zTree.init($("#menu_tree"), setting, menuNodes);
        treeObj.expandAll(true);
        var menuIdListStr = '${menuIdList}';
        if (menuIdListStr) {
            var menuIdList= JSON.parse(menuIdListStr);
            if (menuIdList && menuIdList.length > 0) {
                for (var i = 0; i< menuIdList.length;i++) {
                    var node = treeObj.getNodesByParam("id", menuIdList[i],null);
                    if (node.length == 0) continue;
                    treeObj.checkNode(node[0], true, true);
                }
            }
        }
        $('.ztree a').on('click',function(e){
            e.preventDefault();
        })
    });

    function getMenuId() {
        var nodes = treeObj.getCheckedNodes("true");
        if (!nodes || nodes.length == 0) return "";
        var nodesId = "";
        for (var i = 0;i<nodes.length;i++) {
            nodesId += nodes[i].id + ",";
        }
        return nodesId.substring(0,nodesId.length - 1);
    }

    function showResourceSave() {

        var nodes = treeObj.getCheckedNodes(true);
        var nodeIdList = "";
        if (nodes && nodes.length > 0) {
            for (var i = 0;i<nodes.length;i++) {
                nodeIdList += nodes[i].id + ",";
            }
        }
        if (nodeIdList != "") {
            nodeIdList = nodeIdList.substring(0,nodeIdList.length - 1);
        }
    }
</script>

<script>

    $.validator.setDefaults({
        //认证成功
        submitHandler: function(form) {
            var data = {};
            $(".ems_internal_form").find("input,textarea,select").each(function (index,value) {
                data[$(value).attr("name")] = $.trim($(value).val())
            })
            data["id"] = "${record.id}";
            data["menuIdList"] = getMenuId();
            data["password"] = $.md5($.trim($("#password").val()));
            saveAdmin(data);
        }
    });

    function saveAdmin(data) {
        $.emsAjax({
            url:"/ems/admin/save",
            type:"POST",
            data:data,
            success:function (resp) {
                if (resp.status == "000") {
                    $.toast(resp.message,function () {
                        window.location.href = "/ems/admin/index";
                    })
                }else {
                    $.errorAlert(resp.message);
                }
            }
        })
    }

    function formValidate(form) {
        form.validate({
            rules: {
                login_account: {
                    required:true,
                    remote: {
                        url: "/ems/admin/isAccountExist",
                        type: "POST",
                        data: {login_account:function () {
                            return $("#login_account").val();
                        },id:"${record.id}"}
                    }
                },
                phone : {
                    required : true,
                    minlength : 11,
                    isMobile : true
                }
            },
            messages: {
                login_account:{
                    required:"账号不能为空",
                    remote:"账号已存在，请重新填写"
                },
                phone : {
                    required : "请输入手机号",
                    minlength : "手机不能小于11个字符",
                    isMobile : "请正确填写您的手机号码"
                }
            }
        });
    }

    $(function () {

        $("form").each(function (index,val) {
            $(val)[0].reset();
        });

        // 手机号码验证
        jQuery.validator.addMethod("isMobile", function(value, element) {
            var length = value.length;
            var mobile = /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})$/;
            return this.optional(element) || (length == 11 && mobile.test(value));
        }, "请正确填写您的手机号码");

        //表单验证
        formValidate($(".ems_internal_form"));

        $(".ems_form_submit").on("click",function () {
            var form = $(this).parents(".ems_form").find("form:first");
            form.submit();
        });

        $(".ems_form_reset").on("click",function () {
            $(this).parents(".ems_form").find("form:first")[0].reset();
        })

        $(".ems_form_checkbox_g>label").mouseover(function () {
            $(this).children("a").show();
        }).mouseout(function () {
            $(this).children("a").hide()
        });

    })
</script>
<script src="/ems/js/upload/webuploader.min.js"></script>
<script src="/ems/js/ems/ems_upload.js"></script>
</body>
</html>
